<template>
    <view class="btn-box">
        <u-toast ref="uToast"/>
        <button
            class="pms-btn plain"
            @click="handleClick(item.method)"
            v-for="(item, index) in buttonList"
            :key="index"
            :disabled="showLoading"
        >
            {{ item.button }}
        </button>
        <!-- 弹框 -->
        <u-popup
            :mask-close-able="false"
            :closeable="false"
            v-model="showPopup"
            @close="handleClose"
            mode="bottom"
            height="670rpx"
        >
            <view class="pop-box">
                <view class="my-form">
                    <u-form label-width="160">
                        <u-form-item
                            :label="nodeTitle"
                            required
                        >
                            <u-input
                                :class="{ 'disabled-select': isDisabled }"
                                v-model="form.nodeName"
                                type="select"
                                @click="showSelect = true"
                                :disabled="isDisabled"
                                border
                            />
                        </u-form-item>
                        <u-form-item :label="userTitle" required prop="roleName">
                            <u-input
                                class="disabled-select"
                                type="select"
                                v-model="form.userName"
                                :disabled="true"
                                :placeholder="placeholderPeople"
                                border
                            />
                        </u-form-item>
                        <u-form-item required label="办理意见">
                            <textarea
                              v-model="form.remark"
                              placeholder="请输入内容"
                              border
                              class="my-area"
                              maxlength="500"
                            />
                        </u-form-item>
                    </u-form>
                </view>
                <view class="btns">
                    <button class="pms-btn" plain="true" @click="cancel">
                        取消
                    </button>
                    <button
                        class="pms-btn plain"
                        plain="false"
                        @click="submit"
                    >
                        提交
                    </button>
                </view>
            </view>
            <u-select
                :value-name="'soleId'"
                :label-name="'nodeName'"
                confirm-color="#ca171d"
                style="font-size: 28rpx"
                v-model="showSelect"
                :list="backInfo"
                @confirm="handleConfirm"
            ></u-select>
        </u-popup>
    </view>
</template>

<script>
export default {
    name: "buttonView",
    props: {
        selectUser:{
            type:Object,
            default:()=>({})
        },
        workDetail:{
            type:Object,
            default:()=>({})
        },
        prjDetail:{
            type:Object,
            default:()=>({})
        },
        buttonList:{
            type:Array,
            default:()=>([])
        },
        status:{
            type:Boolean,
            default:false,
        }
    },
    watch: {
        selectUser(val) {
            console.log(val)
            this.$set(this.form, "userName", val.name);
            this.$set(this.form, "userId", val.id);
        },
    },
    data() {
        return {
            form:{
                nodeName:'',
                userName:'',
                userId:'',
                remark:''
            },
            showPopup:false,
            nodeTitle:'',
            userTitle:'',
            isDisabled:false,
            showLoading:false,
            showSelect:false,
            backInfo:[],
            ifNextVal:'',
            finishNode:false, //是否是最后一个节点
            placeholderPeople:'请选择人员'
        };
    },
    methods: {
        submit(){
            console.log('提交',this.form)
            if (this.checkSubmit()) {
                return;
            }
            this.nextBackPageRes();
            // if(this.status){
            //     const params={
            //         oldPrjId: this.prjDetail.oldPrjId,
            //         newPrjId: this.prjDetail.newPrjId,
            //         categoryCode: this.prjDetail.categoryCode,
            //         transferNum: this.prjDetail.transferNum,
            //         subPrjId: this.prjDetail.subPrjId,
            //         assetLabelId: this.prjDetail.assetLabelId,
            //         nextAuditUserAccount: this.form.userId,
            //         newPrjName:this.prjDetail.newPrjName,
            //         role: this.prjDetail.role,
            //         opinion: this.form.remark,
            //         bizSeq:this.prjDetail.bizSeq
            //     }
            //     this.$axios.post('/material/api/flows/adjustPrjFlow/startAdjustPrjFlow',params).then(()=>{
            //         this.doClose();
            //     })
            // }else{
            //     this.nextBackPageRes();
            // }
        },
        nextBackPageRes(){
            let params = {}
            if(this.ifNextVal === '0'){
                params={
                    workItemId: this.workDetail.workItemID,
                    userIds: this.form.userId,
                    route:this.workDetail.activityDefID === 'adjust_prj1' ? this.prjDetail.route :'',
                    wfXpath:[],
                    opinion: this.form.remark,
                    nextSceneId:this.form.sceneId,
                    nodeId:this.form.nodeId,
                    detailId: this.form.detailId,
                    activityDefID: this.workDetail.activityDefID,
                    templateId: this.form.templateId,
                }
            }else if(this.ifNextVal === '1'){
                params={
                    workItemId:this.workDetail.workItemID,
                    opinion: this.form.remark,
                    detailId: this.form.detailId,
                    nextActDefId:this.form.nodeId
                }
            }else if(this.ifNextVal === '2'){
                params={
                    processInstId:this.workDetail.processInstID,
                }
            }else{
                console.log('啥也不干')
            }
            const data = {
                flowId: this.workDetail.bizObject?.bizSeq,
                flowFlag: this.ifNextVal,
                state: this.ifNextVal === '2' ? 'C' : this.form.nodeId,
                wfNextDealParam:params,
            }
            this.$axios.post('/material/api/flows/adjustPrjFlow/doNextAdjustPrjFlow',data).then(()=>{
                this.doClose();
            })
        },
        cancel(){
            this.form = {
                nodeName:'',
                nodeId:'',
                userName:'',
                userId:'',
                remark:''
            }
            this.showPopup=false
        },
        checkSubmit(){
            if (!this.form.nodeName) {
                this.$refs.uToast.show({
                    title: "请选择办理节点!",
                    type: "error",
                    isTab: true,
                });
                return true;
            }
            // 检查是否有选择下一节点办理人
            if (!this.form.userName && !this.finishNode) {
                this.$refs.uToast.show({
                    title: "请选择办理人员",
                    type: "error",
                    isTab: true,
                });
                return true;
            }
            // 检查是否填写了办理意见
            if (!this.form.remark) {
                this.$refs.uToast.show({
                    title: "办理意见不能为空！",
                    type: "error",
                    isTab: true,
                });
                return true;
            }
            return false;
        },
        handleClick(fn){
            this[fn]()
        },
        doClose(){
            imp.iWindow.close();
            uni.navigateBack({
                delta: 1
            });
        },
        close(){
            let that=this;
            uni.showModal({
                confirmColor: '#eb4b4b',
                title: "温馨提示",
                content: "取消后将撤销本次跨项目调整操作，请确认是否取消？",
                success:(result)=>{
                    if(result.confirm){
                        //撤销操作
                        that.ifNextVal='2';
                        that.nextBackPageRes();
                    }else{
                        console.log('取消操作')
                    }
                }
            });
        },
        assignInit(nodeId){
            //下一步节点值事根据role自己写死
            if( nodeId === 'adjust_prj3'){
                this.form.userName = this.prjDetail?.oldPrjManagerName + '(' + this.prjDetail?.oldPrjManagerAccount + ')'
                this.form.userId =  this.prjDetail?.oldPrjManagerAccount || '';
            }else{
                this.form.userName = this.prjDetail?.newPrjManagerName + '(' + this.prjDetail?.newPrjManagerAccount + ')'
                this.form.userId =  this.prjDetail?.newPrjManagerAccount || '';
            }
        },
        assign(){
            this.nodeTitle='办理节点';
            this.userTitle='办理人员';
            this.ifNextVal='0';
            // if(this.status){
            //     this.assignInit('');
            //     this.isDisabled = true;
            // }else{
            //
            // }
            this.backInfo = [];
            const data={
                processInstId: this.workDetail?.processInstID,
                actInsetId: this.workDetail?.activityInstID,
                route: this.workDetail?.activityDefID === 'adjust_prj1' ? this.prjDetail.route :''
            }
            this.$axios.post('/settlement/api/flow/getNextStep',data).then((res)=>{
                res.data.forEach((element, index) => {
                    this.backInfo.push({ ...element, soleId: index });
                });
                this.getFinallyNode(this.backInfo[0])
            })
            this.showPopup=true;
        },
        getFinallyNode(obj){
            this.getUserInfo(obj);
            this.finishNode=obj.finishNode
            if(obj.finishNode){
                this.placeholderPeople=''
            }else{
                this.placeholderPeople='请选择人员'
            }
        },
        getUserInfo(item){
            this.form.nodeName = item.nodeName;
            this.form.nodeId = item.nodeId;
            this.form.sceneId = item.sceneId;
            this.form.detailId = item.detailId;
            this.form.finishNode = item.finishNode;
            this.form.templateId = item.templateId;
            this.assignInit(item.nodeId);
        },
        backInit(res){
            this.form.nodeName = res.nodeName;
            this.form.nodeId = res.nodeId;
            this.form.userId = res.userId;
            this.form.sceneId = res.sceneId;
            this.form.detailId = res.detailId;
            this.form.finishNode = res.finishNode;
            this.form.templateId = res.templateId;
            this.form.userName = res.userName+'('+res.userId+')';
        },
        doBack(){
            let that=this;
            this.backInfo = [];
            const data ={
                processInstId: this.workDetail.processInstID,
                actInsetId: this.workDetail.activityInstID,
                route: '',
                excludeActDefIds: ''
            }
            this.$axios.post('/settlement/api/flow/getBackNextStepPerson',data).then((res)=>{
                if(res.data?.length > 0){
                    this.ifNextVal='1';
                    res.data.forEach((element, index) => {
                        this.backInfo.push({ ...element, soleId: index });
                    });
                    this.nodeTitle = "回退节点";
                    this.userTitle = "回退办理人";
                    this.ifNextVal='1';
                    this.backInit(this.backInfo[0]);
                    this.showPopup=true;
                }else{
                    uni.showModal({
                        title: '温馨提示',
                        content: "请确认是否取消本次跨项目调整流程？确定后您申请的跨项目调整流程将被取消。",
                        showCancel:true,
                        confirmColor: '#eb4b4b',
                        success: function (res1) {
                            if (res1.confirm) {
                                that.ifNextVal='2';
                                that.nextBackPageRes();
                            }else{
                                console.log('啥也不干')
                            }
                        }
                    })
                }
            })
        },
        handleClose() {
            this.$emit("popClose");
        },
        handleConfirm(e){
            let res = this.backInfo.find((item) => item.soleId == e[0].value);
            if(this.ifNextVal !== '0'){
                //回退  不用选人
                this.form.nodeName = res.nodeName;
                this.form.nodeId = res.nodeId;
                this.form.userId = res.userId;
                this.form.sceneId = res.sceneId;
                this.form.detailId = res.detailId;
                this.form.finishNode = res.finishNode;
                this.form.templateId = res.templateId;
                this.form.userName = res.userName+'('+res.userId+')';
            }else{
                this.getFinallyNode(res)
            }
        },

    },
};
</script>

<style lang="scss" scoped>
.btn-box {
    position: fixed;
    width: 100vw;
    bottom: 0;
    left:0;
    background-color: #f7f8fa;
    display: flex;
    justify-content: space-evenly;
}
.pms-btn {
    height: 60rpx;
    min-width: 130rpx;
    line-height: 60rpx;
    border-radius: 60rpx;
    color: #ca171d;
    border-color: #ca171d;
    margin: 30rpx 6rpx;
    font-size: 24rpx;
    &.plain {
        color: #fff;
        background: #ca171d;
    }
}
.pop-box {
    padding: 20rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}
.my-form {
    width: 100%;
    padding: 40rpx 40rpx 20rpx;
}
.my-area {
    border: 2rpx solid rgb(220, 223, 230);
    width: 100% !important;
    border-radius: 8rpx;
    font-size: 28rpx;
    padding: 20rpx;
    height: 150rpx;
    &.red-err {
        border: 2rpx solid #fa3534 !important;
    }
}
.btns {
    display: flex;
    background: #fff;
    font-size: 12rpx;
}
.pms-btn {
    height: 60rpx;
    min-width: 130rpx;
    line-height: 60rpx;
    border-radius: 60rpx;
    color: #ca171d;
    border-color: #ca171d;
    margin: 20rpx 6rpx;
    font-size: 24rpx;
    &.plain {
        color: #fff;
        background: #ca171d;
    }
}
.disabled-select {
    pointer-events: none;
    background: rgba(220, 223, 230, 0.3);
}
::v-deep .u-form-item--left{
    align-items: flex-start !important;
}
</style>
